<template>
  <div class="sticky-top container-fluid shadow">
    <div class="row">
      <div class="col-12 col-md-12 col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
        <div class="row">
          <!-- 标志 -->
          <div class="col-2 col-md-2 col-lg-3">
            <header-left></header-left>
          </div>

          <!-- 用户信息 -->
          <div class="col-10 col-md-10 col-lg-9">
            <header-right></header-right>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import HeaderLeft from "./HeaderLeft.vue";
import HeaderRight from "./HeaderRight.vue";
export default {
  components: { HeaderLeft, HeaderRight },
};
</script>

<style scoped>
.row {
  background-color: white;
}
.index {
  background-color: aquamarine;
}
span {
  font-family: Avenir, Helvetica, Arial, sans-serif;
}
</style>